<template>
	<view >
		
		<!-- <view>疫苗预约</view> -->
		<cu-custom bgColor="bg-E96141" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">疫苗信息</block>
		</cu-custom>
		
		<scroll-view scroll-y scroll-with-animation :scroll-top="0">
			<view style="display: flex;flex-direction: column;">
				<view>				
					<uni-card style="background-color: #24a7bf;color: #FFFFFF;">
						<text style="color: #FFFFFF;" >{{title}}介绍</text>
					</uni-card>
					<uni-card style="">{{des}}</uni-card>
				</view>
				<view>
					<uni-card style="background-color: #24a7bf;color: #FFFFFF;">
						<text style="color: #FFFFFF;" >{{memberinfo.name}}接种者信息</text>
					</uni-card>
					<uni-card style="" :isShadow="true">
						<form>
							<view class="cu-form-group">
								<view class="title">姓名</view>
								<input v-model="memberinfo.name" :disabled="flag"></input>
							</view>
							<view class="cu-form-group">
								<view class="title">电话</view>
								<input  name="input" 
									v-model="memberinfo.phone" value="phone"
									maxlength="50" :disabled="flag"></input>
							</view>
							<view class="cu-form-group">
								<view class="title">年龄</view>
								<input  name="input" 
									v-model="memberinfo.age" value="age"
									maxlength="50" :disabled="flag"></input>
							</view>
							<view class="cu-form-group">
								<view class="title">地址</view>
								<input name="input" 
									v-model="memberinfo.address" value="address"
									maxlength="50" :disabled="flag"></input>
							</view>
							<view class="cu-form-group" v-if="memberinfo.status==0">
								<view class="title" style="color: red;">疫苗接种状态:未接种</view>
								
							</view>
							<view class="cu-form-group" v-if="memberinfo.status==1" style="display: flex;flex-direction: column;color: red;">
								<view class="title">疫苗接种状态:已接种</view>
								<view v-for="(item,index) in jzinfo" :key="index" style="display: flex;">
									<view>疫苗名称：{{item.yimiaoName}}</view>
									<view style="margin-left:10upx;">接种日期：{{item.createTime}}</view>
								</view>
								
							</view>
						</form>
					</uni-card>
				</view>
				<view @click="addmember" class="cadd">添加新接种者</view>
				<view style="margin-top: 20upx;text-align: center;">
					<radio value="r1" :checked="flag1"style="transform:scale(0.9)" @tap="changvalue"/>我已知晓注射疫苗应注意的相关事项
				</view>
				<view class="sub" style="" @click="tosub" v-if="flag1">确认提交</view>
			</view>
		</scroll-view>
		
		
	</view>
</template>

<script>
	import uniCard from '../../components/my-componets/uni-card.vue'
	import {USER_ACCOUNT} from "@/common/util/constants"
	export default{
		comments:{
			uniCard
		},
		data(){
			return{
				des:'',
				title:'',
				flag:true,
				remark:'',
				price:'',
				ylbPrice:'',
				flag1:true,
				// jzinfo:[{'id':'1','ymname':'水豆疫苗','createtime':'2020-3-14'},{'id':'2','ymname':'HPV疫苗','createtime':'2022-9-14'}],
				jzinfo:[],
				memberinfo:{},
				editFlag: false
			}
		},
		onLoad(options){
			this.des=options.des,
			this.title=options.id,
			this.price=options.price,
			this.remark=options.remark,
			this.ylbPrice=options.ylbPrice,
			this.getmemberinfo()
			
		},
		filters:{
			datafilter(d){
			 if(d.length<12){
					return d
				}else{
					let str=d.slice(0,12)	
					 return str+"..."
				}
			},		
		},
		methods: {
			getmemberinfo(){
				this.memberinfo.phone=uni.getStorageSync(USER_ACCOUNT)
				console.log(this.memberinfo.phone)
				let _params = {
					phone : this.memberinfo.phone
				}
				let that = this
				let url="/yimiaorecord/info/queryListByPhone"
				 that.$http.get(url,{params:_params}).then(res=>{
						if(res.data.success){
							this.memberinfo = res.data.result[0]
							this.jzinfo = res.data.result
							console.log(this.jzinfo+"------that.memberinfo------"+this.memberinfo.address)
						}
				})
			},
			addmember(){
				this.flag=false
				this.memberinfo.name=''
				this.memberinfo.phone=''
				this.memberinfo.age=''
				this.memberinfo.address=''
				this.memberinfo.state=0
				this.editFlag = true
				console.log(111)
			},
			tosub(){
				
				let _param={
					name:'张三',
					age:'26',
					address:'经二路87号那里国际',
					phone:'',
					status:'1',  //接种状态 0 未接种 1 已接种
				}
				let _params = {
					orderType: '0',
					payType: this.payType,
					vipLevelId: this.vipLevelId
				}
				let that = this
				let url="/yimiaorecord/info/add"
				console.log("--address---"+this.memberinfo.address)
				if(this.editFlag && this.memberinfo.address != ''){
					that.$http.post(url,this.memberinfo).then(res=>{
							if(res.data.success){
								console.log("------保存接种人信息成功------"+this.memberinfo.address)
								 uni.navigateTo({
								 	url: '/pages/order/submit-order?price=' + that.price+"&orderType=4"+"&title="+that.title +"&remark="+that.remark+"&ylbPrice="+that.ylbPrice
								 })
							}else{
								console.log('-------------保存接种人信息失败---')
							}
					})
					console.log('-------点击添加人名-1--'+_param.address)
				}else{
					console.log("------------没有点击---"+that.title)
					
						 uni.navigateTo({
							url: '/pages/order/submit-order?price=' + that.price+"&orderType=4"+"&title="+that.title +"&remark="+that.remark+"&ylbPrice="+that.ylbPrice
						 })
				}
				
				 
				
			},
			changvalue(){
				this.flag1=!this.flag1
			}
		}
	}
</script>

<style>
	.cu-form-group .title {
		min-width: calc(4em + 15px);
	}
	.cadd{
		text-align: center;
		background-color: #24a7bf;
		 color:#FFFFFF;
		  border-radius: 15upx;
		  padding: 10upx;
		  background-image: url(/static/add.png);
		  background-repeat: no-repeat;
		  background-position: 30% 50%;
	
	}
	.sub{
		text-align: center;
		background-color: red;
		 color:#FFFFFF; 
		width:180upx;
		border-radius: 15upx;
		padding: 10upx;
		margin-left: 70%;
		margin-top: 20upx;
	}
</style>

